import ChiVoxSDK from 'chivox';
import Config from './config';

import $ from 'jquery';
import '../css/chivox-example.css';

let refText = "I want to know the past and present of Hong Kong.";
$(".currentWord").html(refText);

let sdk = new ChiVoxSDK({
    appKey: Config.appKey,
    //mode: ChiVoxSDK.MODE.FLASH,
    sigurl: "/token",
    data: {
      audioUrl: "/static/I-want-to-know-the-past-and-present-of-Hong-Kong.mp3",//音频URL
      serverParams: {
        coreType: "en.sent.score",
        refText: refText,
        rank: 100,
        userId: "chivox tester",
      }
    },
    onInit: (errno, err) => {
        console.info('[ onInit ]:', errno, err);
    },
    onError: (err) => {
        console.info('[ onError ]:', err);
    },
    onBeforeRecord: () => {
      $("#scoreResult .pron").empty();
      $("#scoreResult .fluency").empty();
      $("#scoreResult .details").empty();
    },
    onScore: (data) => {
      var resultObj = new ChiVoxSDK.EnSentScore(data);
      $("#scoreResult .pron").html(resultObj.getPron());
      $("#scoreResult .fluency").html(resultObj.getFluency());

      var html = '', htmlA = '', htmlB = '';
      html += '<table border="0" cellpadding="0" cellspacing="0">';
      for (var i = 0; i < resultObj.getWordSize(); i++) {
        htmlA += '<td align="center" style="padding:0 10px;">' + resultObj.getWord(i).getChar() + '</td>';
        htmlB += '<td align="center">' + resultObj.getWord(i).getScore() + '</td>';
      }

      html += '<tr>' + htmlA + '</tr>';
      html += '<tr>' + htmlB + '</tr>';
      html += '</table>';
      $("#scoreResult .details").html(html);
    },
    onScoreError: (errorType) => {//评分失败的显示 "TIMEOUT", "NO_DATA", ErrorID
      var errorObj = ChiVoxSDK.StatusCode.get(errorType, "cn");
      alert(errorObj.feedback);
    }
});

$(".changeWordButton").click(() => {
  refText = "The food price is high at present.";
  $(".currentWord").html(refText);
  $("#scoreResult .pron").empty();
  $("#scoreResult .fluency").empty();
  $("#scoreResult .details").empty();

  sdk.setData({
    audioUrl: "/static/The-food-price-is-high-at-present.mp3",
    serverParams: {
      coreType: "en.sent.score",
      res:"eng.snt.g4",
      refText: refText,
      rank: 100,
      userId: "chivox tester",
    }
  });
});

$('#info').text(`ChiVoxSDK ver: ${ChiVoxSDK.VERSION}, mode: ${ChiVoxSDK.mode(sdk.options.mode)}`);
